// 等待页面加载完成
document.addEventListener('DOMContentLoaded', function() {
    // 1. 轮播图功能（修复激活状态+自动播放）
    const slides = document.querySelectorAll('.slide');
    const prevBtn = document.querySelector('.prev-btn');
    const nextBtn = document.querySelector('.next-btn');
    const indicators = document.querySelectorAll('.indicator');
    let currentIndex = 0;
    let slideInterval;

    // 显示指定索引的轮播图
    function showSlide(index) {
        // 清除所有激活状态
        slides.forEach(slide => slide.classList.remove('active'));
        indicators.forEach(indicator => indicator.classList.remove('active'));
        
        // 循环播放逻辑
        if (index >= slides.length) currentIndex = 0;
        if (index < 0) currentIndex = slides.length - 1;
        
        // 激活当前项
        slides[currentIndex].classList.add('active');
        indicators[currentIndex].classList.add('active');
    }

    // 下一张/上一张
    function nextSlide() {
        currentIndex++;
        showSlide(currentIndex);
    }

    function prevSlide() {
        currentIndex--;
        showSlide(currentIndex);
    }

    // 自动播放（3秒切换一次）
    function startAutoPlay() {
        slideInterval = setInterval(nextSlide, 4000);
    }

    // 悬停暂停/恢复
    document.querySelector('.hero').addEventListener('mouseenter', () => clearInterval(slideInterval));
    document.querySelector('.hero').addEventListener('mouseleave', startAutoPlay);

    // 按钮点击事件
    prevBtn.addEventListener('click', () => {
        prevSlide();
        startAutoPlay(); // 点击后重启自动播放
    });
    nextBtn.addEventListener('click', () => {
        nextSlide();
        startAutoPlay(); // 点击后重启自动播放
    });

    // 指示器点击事件
    indicators.forEach((indicator, index) => {
        indicator.addEventListener('click', () => {
            currentIndex = index;
            showSlide(currentIndex);
            startAutoPlay(); // 点击后重启自动播放
        });
    });

    // 初始化轮播图
    showSlide(currentIndex);
    startAutoPlay();

    // 2. 移动端下拉菜单优化
    const mainNavItems = document.querySelectorAll('.main-nav li');
    mainNavItems.forEach(item => {
        const dropdown = item.querySelector('.dropdown-menu');
        if (dropdown) {
            const link = item.querySelector('a');
            link.addEventListener('click', (e) => {
                if (window.innerWidth <= 768) {
                    e.preventDefault();
                    dropdown.style.display = dropdown.style.display === 'block' ? 'none' : 'block';
                }
            });
        }
    });

    // 3. 导航栏滚动变色+Logo切换
    const headerWrapper = document.querySelector('.header-wrapper');
    const logoImg = headerWrapper.querySelector('.logo-box img');
    const mainNavLinks = headerWrapper.querySelectorAll('.main-nav > li > a');
    const userNavLinks = headerWrapper.querySelectorAll('.user-nav a');

    // 滚动处理函数
    function checkScrollPosition() {
        const scrollY = window.scrollY;
        
        if (scrollY > 50) {
            // 滚动后样式
            headerWrapper.style.background = 'white';
            headerWrapper.style.height = '160px';
            headerWrapper.style.boxShadow = '0 2px 10px rgba(0,0,0,0.1)';
            logoImg.style.height = '90px';
            logoImg.src = 'https://www.xmu.edu.cn/images/logo2.png';

            // 导航文字变色
            mainNavLinks.forEach(link => {
                link.style.fontSize = '18px';
                link.style.height = '38px';
                link.style.lineHeight = '38px';
                link.style.color = '#333333';
            });
            userNavLinks.forEach(link => {
                link.style.textShadow = 'none';
                link.style.color = '#333333';
            });
        } else {
            // 顶部样式
            headerWrapper.style.background = 'transparent';
            headerWrapper.style.height = '170px';
            headerWrapper.style.boxShadow = 'none';
            logoImg.style.height = '100px';
            logoImg.src = 'https://www.xmu.edu.cn/images/logo.png';

            // 恢复文字样式
            mainNavLinks.forEach(link => {
                link.style.fontSize = '19px';
                link.style.height = '42px';
                link.style.lineHeight = '42px';
                link.style.color = '#ffffff';
            });
            userNavLinks.forEach(link => {
                link.style.textShadow = '0 1px 2px rgba(0,0,0,0.2)';
                link.style.color = '#ffffff';
            });

            // Logo加载失败降级
            logoImg.onerror = function() {
                this.src = 'https://www.xmu.edu.cn/images/logo2.png';
                this.onerror = null;
            };
        }
    }

    // 页面加载时检查+滚动监听
    checkScrollPosition();
    window.addEventListener('scroll', checkScrollPosition);

    // 4. 媒体厦大标签切换功能（新增黄色效果）
    const mediaTabs = document.querySelectorAll('.media-tab');
    const tabPanels = document.querySelectorAll('.tab-panel');

    // 媒体标签点击事件
    mediaTabs.forEach(tab => {
        tab.addEventListener('click', () => {
            // 移除所有标签的active和yellow类
            mediaTabs.forEach(t => {
                t.classList.remove('active');
                t.classList.remove('yellow');
            });
            
            // 给当前点击的标签添加active和yellow类
            tab.classList.add('active');
            tab.classList.add('yellow');
            
            // 隐藏所有面板
            tabPanels.forEach(panel => panel.classList.remove('active'));
            
            // 显示对应面板
            const targetPanel = document.getElementById(tab.dataset.tab);
            if (targetPanel) {
                targetPanel.classList.add('active');
            }
        });
    });

    // 5. 查看更多按钮点击事件
    document.querySelector('.view-more-btn').addEventListener('click', function() {
        // 这里可跳转至新闻列表页，示例用alert演示
        alert('即将跳转到新闻列表页');
        // 实际项目中替换为：window.location.href = 'news-list.html';
    });

    // 6. 窗口大小变化适配
    window.addEventListener('resize', () => {
        if (window.innerWidth <= 992) {
            const scrollY = window.scrollY;
            headerWrapper.style.height = 'auto';
            headerWrapper.style.padding = scrollY > 50 ? '10px 20px' : '15px 20px';
            logoImg.style.height = scrollY > 50 ? '50px' : '60px';
        } else {
            checkScrollPosition();
        }
    });
});
